<template>
  <div>
    <input type="text" v-model="taskTitle" placeholder="请输你的任务名称,按回车键确认" class="inputStyle">
    <button @click="addTask">确定</button>
  </div>

</template>

<script>
  export default {
    name: "Home",
    data(){
      return {
        taskTitle:''
      }
    },

    methods:{
      addTask(){
        if (this.taskTitle != ''){
          this.$emit('addTaskName',this.taskTitle)
          this.taskTitle = ''
        }else{
          alert('任务名称不能为空!')
        }

      }
    }
  }
</script>

<style scoped>
input{
  margin: 0;
  padding: 0;
}

.inputStyle{
  height: 30px;
  width: 80%;
  text-align: center;
}
</style>
